import { IPublicTypeComponentMetadata, IPublicTypeSnippet } from '@alilc/lowcode-types';

const DataTableMeta: IPublicTypeComponentMetadata = {
  componentName: 'DataTable',
  title: '数据表格',
  category: '信息展示',
  group: '公共组件',
  docUrl: '',
  screenshot: '',
  devMode: 'proCode',
  npm: {
    package: 'hzdz-charts',
    version: '0.1.0',
    exportName: 'DataTable',
    main: 'src/index.tsx',
    destructuring: true,
    subName: ''
  },
  props: [
    {
      name: 'ref',
      propType: 'object',
    },
    {
      name: 'key',
      propType: 'string',
    },
    {
      name: 'style',
      propType: 'object',
    },
    {
      name: 'className',
      propType: 'string',
    },
    {
      name: 'width',
      propType: 'number',
      description: '表格宽度'
    },
    {
      name: 'height',
      propType: 'string',
      description: '表格高度'
    },
    {
      name: 'headerBackgroundImage',
      propType: 'string',
      description: '表头背景图片'
    },
    {
      name: 'headerBackgroundColor',
      propType: 'string',
      description: '表头背景颜色'
    },
    {
      name: 'rowBackgroundColor',
      propType: 'string',
      description: '行背景颜色'
    },
    {
      name: 'alternateRowBackgroundColor',
      propType: 'string',
      description: '交替行背景颜色'
    },
    {
      name: 'columns',
      propType: 'array',
      description: '表格列配置'
    },
    {
      name: 'dataSource',
      propType: 'array',
      description: '表格数据源'
    },
    {
      name: 'headerHeight',
      propType: 'number',
      description: '表头高度'
    },
    {
      name: 'rowHeight',
      propType: 'number',
      description: '行高度'
    },
    {
      name: 'maxRows',
      propType: 'number',
      description: '最大显示行数'
    },
    {
      name: 'showHeader',
      propType: 'bool',
      description: '显示表头'
    },
    {
      name: 'headerTextColor',
      propType: 'string',
      description: '表头文字颜色'
    },
    {
      name: 'rowTextColor',
      propType: 'string',
      description: '行文字颜色'
    },
    {
      name: 'headerFontSize',
      propType: 'number',
      description: '表头字体大小'
    },
    {
      name: 'rowFontSize',
      propType: 'number',
      description: '行字体大小'
    },
    {
      name: 'columnSpacing',
      propType: 'number',
      description: '列间距'
    },
    {
      name: 'showBorder',
      propType: 'bool',
      description: '显示边框'
    },
    {
      name: 'hoverRowColor',
      propType: 'string',
      description: '悬停行颜色'
    },
    {
      name: 'selectedRowColor',
      propType: 'string',
      description: '选中行颜色'
    },
    {
      name: 'emptyText',
      propType: 'string',
      description: '空数据提示文字'
    },
    {
      name: 'loading',
      propType: 'bool',
      description: '加载状态'
    },
    {
      name: 'theme',
      propType: 'string',
      description: '主题'
    },
    {
      name: 'onRowClick',
      propType: 'func',
      description: '行点击事件'
    },
    {
      name: 'onRowDoubleClick',
      propType: 'func',
      description: '行双击事件'
    },
    {
      name: 'onHeaderClick',
      propType: 'func',
      description: '表头点击事件'
    },
    {
      name: 'onClick',
      propType: 'func',
      description: '点击事件'
    }
  ],
  configure: {
    props: [
      {
        name: 'columns',
        title: { label: { type: 'i18n', 'en-US': 'columns', 'zh-CN': '表格列配置' } },
        setter: { componentName: 'JsonSetter', isRequired: false }
      },
      {
        name: 'dataSource',
        title: { label: { type: 'i18n', 'en-US': 'dataSource', 'zh-CN': '表格数据源' } },
        setter: { componentName: 'JsonSetter', isRequired: false }
      },
      {
        name: 'headerBackgroundImage',
        title: { label: { type: 'i18n', 'en-US': 'headerBackgroundImage', 'zh-CN': '表头背景图片' } },
        setter: { componentName: 'StringSetter', isRequired: false, initialValue: 'http://localhost:8085/static/images/qixiangfangzhai/bz54.png' }
      },
      {
        name: 'headerBackgroundColor',
        title: { label: { type: 'i18n', 'en-US': 'headerBackgroundColor', 'zh-CN': '表头背景颜色' } },
        setter: { componentName: 'ColorSetter', isRequired: false, initialValue: 'rgba(0,0,0,0.3)' }
      },
      {
        name: 'alternateRowBackgroundColor',
        title: { label: { type: 'i18n', 'en-US': 'alternateRowBackgroundColor', 'zh-CN': '交替行背景颜色' } },
        setter: { componentName: 'ColorSetter', isRequired: false, initialValue: 'rgba(16,85,163,0.18)' }
      },
      {
        name: 'headerTextColor',
        title: { label: { type: 'i18n', 'en-US': 'headerTextColor', 'zh-CN': '表头文字颜色' } },
        setter: { componentName: 'ColorSetter', isRequired: false, initialValue: '#56A5FF' }
      },
      {
        name: 'rowTextColor',
        title: { label: { type: 'i18n', 'en-US': 'rowTextColor', 'zh-CN': '行文字颜色' } },
        setter: { componentName: 'ColorSetter', isRequired: false, initialValue: 'rgba(255,255,255,0.9)' }
      },
      {
        name: 'headerHeight',
        title: { label: { type: 'i18n', 'en-US': 'headerHeight', 'zh-CN': '表头高度' } },
        setter: { componentName: 'NumberSetter', isRequired: false, initialValue: 40 }
      },
      {
        name: 'rowHeight',
        title: { label: { type: 'i18n', 'en-US': 'rowHeight', 'zh-CN': '行高度' } },
        setter: { componentName: 'NumberSetter', isRequired: false, initialValue: 40 }
      },
      {
        name: 'maxRows',
        title: { label: { type: 'i18n', 'en-US': 'maxRows', 'zh-CN': '最大显示行数' } },
        setter: { componentName: 'NumberSetter', isRequired: false, initialValue: 10 }
      },
      {
        name: 'columnSpacing',
        title: { label: { type: 'i18n', 'en-US': 'columnSpacing', 'zh-CN': '列间距' } },
        setter: { componentName: 'NumberSetter', isRequired: false, initialValue: 0 }
      },
      {
        name: 'headerFontSize',
        title: { label: { type: 'i18n', 'en-US': 'headerFontSize', 'zh-CN': '表头字体大小' } },
        setter: { componentName: 'NumberSetter', isRequired: false, initialValue: 16 }
      },
      {
        name: 'rowFontSize',
        title: { label: { type: 'i18n', 'en-US': 'rowFontSize', 'zh-CN': '行字体大小' } },
        setter: { componentName: 'NumberSetter', isRequired: false, initialValue: 14 }
      },
      {
        name: 'showHeader',
        title: { label: { type: 'i18n', 'en-US': 'showHeader', 'zh-CN': '显示表头' } },
        setter: { componentName: 'BoolSetter', isRequired: false, initialValue: true }
      },
      {
        name: 'showBorder',
        title: { label: { type: 'i18n', 'en-US': 'showBorder', 'zh-CN': '显示边框' } },
        setter: { componentName: 'BoolSetter', isRequired: false, initialValue: false }
      },
      {
        name: 'loading',
        title: { label: { type: 'i18n', 'en-US': 'loading', 'zh-CN': '加载状态' } },
        setter: { componentName: 'BoolSetter', isRequired: false, initialValue: false }
      },
      {
        name: 'emptyText',
        title: { label: { type: 'i18n', 'en-US': 'emptyText', 'zh-CN': '空数据提示文字' } },
        setter: { componentName: 'StringSetter', isRequired: false, initialValue: '暂无数据' }
      }
    ],
    supports: {
      style: true
    }
  }
};

const snippets: IPublicTypeSnippet[] = [
  {
    title: '数据表格',
    screenshot: '',
    schema: {
      componentName: 'DataTable',
      props: {
        width: 460,
        height: 'auto',
        headerBackgroundImage: 'http://localhost:8085/static/images/qixiangfangzhai/bz54.png',
        headerBackgroundColor: 'rgba(0,0,0,0.3)',
        rowBackgroundColor: 'transparent',
        alternateRowBackgroundColor: 'rgba(16,85,163,0.18)',
        columns: [
          {
            key: 'level',
            title: '天气预警等级',
            width: 96,
            align: 'center',
            dataIndex: 'level'
          },
          {
            key: 'name',
            title: '预警名称',
            width: 168,
            align: 'center',
            dataIndex: 'name'
          },
          {
            key: 'time',
            title: '预警发布时间',
            width: 128,
            align: 'center',
            dataIndex: 'time'
          }
        ],
        dataSource: [
          {
            key: '1',
            level: 'IV级',
            name: '杭州市临平区气象台发布…',
            time: '2025-05-09 04:00:00'
          },
          {
            key: '2',
            level: 'IV级',
            name: '杭州市临平区气象台发布…',
            time: '2025-05-09 04:00:00'
          }
        ],
        headerHeight: 40,
        rowHeight: 40,
        maxRows: 10,
        showHeader: true,
        headerTextColor: '#56A5FF',
        rowTextColor: 'rgba(255,255,255,0.9)',
        headerFontSize: 16,
        rowFontSize: 14,
        headerFontWeight: 500,
        rowFontWeight: 400,
        columnSpacing: 0,
        showBorder: false,
        hoverRowColor: 'rgba(86,165,255,0.2)',
        selectedRowColor: 'rgba(86,165,255,0.3)',
        emptyText: '暂无数据',
        loading: false,
        theme: 'dark'
      }
    }
  }
];

export default {
  ...DataTableMeta,
  snippets
}; 